/****************
 *@description: 采购详情 procurement/list/detail
 *@author: Xhd
 *@date: 2023-07-14 13:31:19
 *@version: V1.0.0
*************************************************************************/

import React, { Component } from "react";
import { Form, Input, Col } from "antd";
import TheTable from '@/components/TheTable';
import TheButton from "@/components/TheButton";
import { apiStockPurchaseView } from "@/request/procurement";
import { exportSheetTable } from '@/utils/exportTable';
import GoBack from '@/components/TheGoBack';

const { Search } = Input

class Procurement extends Component {
  constructor(props) {
    super(props);
    this.queryFormRef = React.createRef()
    this.state = {
      columns: [
        {
          title: "序号",
          dataIndex: "index",
          key: "index",
          render: (text, record, index) => {
            return record.code === "合计" ? '' : index + 1
          }
        },
        {
          title: "采购仓库",
          dataIndex: "libraryName",
          key: "libraryName",
        },
        {
          title: "供应商",
          dataIndex: "supplierName",
          key: "supplierName",
        },
        {
          title: "采购单号",
          dataIndex: "code",
          key: "code",
        },
        {
          title: "物品名称",
          dataIndex: "goodsName",
          key: "goodsName",
        },
        {
          title: '物料名称',
          dataIndex: 'materialName',
          key: 'materialName'
        },
        {
          title: "物料编码",
          dataIndex: "goodsSkuNo",
          key: "goodsSkuNo",
        },
        {
          title: "规格名",
          dataIndex: "goodsSkuName",
          key: "goodsSkuName",
        },
        {
          title: "应收数量",
          dataIndex: "shouldInNum",
          key: "shouldInNum",
        },
      ],
      library: "",
      supplier: "",
      dataSource: [],
      pageData: {
        pageNo: 1,
        pageSize: 10
      },
      total: 0,
    }
  }

  componentDidMount() {
    this.getData()
  }

  getData = async function () {
    await apiStockPurchaseView({ id: this.props.match.params.id }).then(res => {
      console.log(res.data);
      if (res.code === 0) {
        this.setState({
          library: res.data.libraryName,
          supplier: res.data.supplierName,
          dataSource: res.data.stockPurchaseDetailsVos,
        })
      }
    })
  }

  exportGoods() {
    let { library, supplier, dataSource } = this.state
    let tH_data = [
      {
        title: `${library}-采购单详情(供应商:${supplier})`,
        prop: '',
        children: [
          { prop: 'index', title: '序号' },
          { prop: 'libraryName', title: '采购仓库' },
          { prop: 'supplierName', title: '供应商' },
          { prop: 'code', title: '采购单号' },
          { prop: 'goodsName', title: '商品名称' },
          { prop: 'materialName', title: '物料名称' },
          { prop: 'goodsSkuNo', title: '物料编码' },
          { prop: 'goodsSkuName', title: '规格名' },
          { prop: 'shouldInNum', title: '应收数量', valueType: 'number' },
        ]
      }
    ]
    let code = dataSource[0].code;
    let tB_data = dataSource.map((item, index) => {
      return {
        index: index + 1,
        libraryName: item.libraryName,
        supplierName: item.supplierName,
        code: item.code,
        goodsName: item.goodsName,
        materialName: item.materialName,
        goodsSkuNo: item.goodsSkuNo,
        goodsSkuName: item.goodsSkuName,
        shouldInNum: item.shouldInNum,
      }
    })
    exportSheetTable({
      fileName: `${library}-采购单详情-${code}`, tH_data: tH_data, tB_data: tB_data, isSheet: true, merge: false
    })
  }

  render() {
    const { columns, dataSource, library, supplier } = this.state
    return <div className={"p-layout-box commodity-content"}>
      <GoBack history={this.props.history} title="采购单详情" />
      <Form layout="inline" style={{ marginBottom: "10px", marginTop: "10px" }} >
        <Search
          placeholder="请输入物料编码"
          onChange={(e) => this.setSearchValue(e)}
          style={{
            width: 200,
            marginRight: "20px"
          }}
          allowClear
        />
        <Col span={6} >
          <Form.Item name={"libraryId"} label="采购仓库" rules={[{ required: true }]}>
            {library}
          </Form.Item>
        </Col>
        <Col span={6} >
          <Form.Item name={"supplierId"} label="供应商" rules={[{ required: true }]}>
            {supplier}
          </Form.Item>
        </Col>
      </Form>
      <div>
        <TheButton onClick={() => this.exportGoods()} type="dashed" size="middle">导出</TheButton>
      </div>
      <TheTable columns={columns} dataSource={dataSource} pagination={false} bordered={1}
        scroll={{ x: 'max-content', y: '55vh' }} style={{ marginTop: "10px" }}
      ></TheTable>
    </div>
  }

}

export default Procurement